﻿# Шапка сайта

## Описание

Сайт компании ИЖМАШТОРГ долгое время был статичным. После выпуска первого электромобиля маркетолог компании заметил резкий скачок посещений с различных устройств. Изменения в сторону адаптивной верстки было решено проводить постепенно. Для начала сайт решили сделать резиновым.

Первым элементом, в который нужно внести правки, будет шапка сайта.
Сейчас, если открыть сайт в браузере с шириной окна `1024px`, появится горизонтальная полоса прокрутки:

![Scroll on header](../../sources/fluid-header-scroll.jpg)

Избавьтесь от нее, чтобы шапка сайта выглядела так:

![Scroll on header](../../sources/fluid-header-noscroll.jpg)

При этом, если ширина окна браузера больше `1280px` контент сайта должен располагаться по центру:

![Header on a widescreen](../../sources/fluid-header-widescreen.jpg)

При ширине окна браузера меньше `1024px` должна появляться горизонтальная полоса прокрутки.

## Процесс реализации

1. Измените свойство `width` для блока с классом `container` так, чтобы элемент занимал всю доступную ширину родительского элемента.

2. Ограничьте ширину блока с классом `container` так, чтобы минимальная ширина блока равнялась `1024px`, а максимальная — `1280px`.

3. Переопределите значение минимальной ширины для блока с классом `header`.

Правильность своего решения можно проверить, меняя ширину окна браузера и следя за изменениями размеров блоков. Когда вы, сужая экран, пройдете значение `1024px`, то фон примера изменится следующим образом:

![Header on a small screen](../../sources/fluid-header-smallscreen.jpg)

Не требуется вносить какие-либо другие правки в CSS или писать дополнительные правила. Также не изменяйте HTML-разметку.

## Реализация

В ходе решения этой задачи не изменяйте HTML-разметку.

Внесите изменения во вкладке CSS. Перед началом работы сделайте форк пена на [https://codepen.io/Netology/pen/rGEGJm](https://codepen.io/Netology/pen/rGEGJm?editors=0100#0)
